import QtQuick
import QtQuick.Controls
import Qt5Compat.GraphicalEffects

Item {

    Flow {

        anchors.fill: parent
        spacing: 10
        padding: 10

        Rectangle {
            width: 280
            height: 280

            Text {
                text: "BrightnessContrast"
                font.bold: true
                font.pointSize: 15
                anchors.horizontalCenter: parent.horizontalCenter
            }

            Image {
                id: butterfly
                source: "qrc:/images/butterfly.png"
                sourceSize: Qt.size(parent.width, parent.height)
                smooth: true
                visible: false
            }

            BrightnessContrast {
                id: brightnessContrast
                anchors.fill: butterfly
                source: butterfly
                brightness: 0.5
                contrast: 0.5
            }

            Grid {
                rows: 3
                columns: 2
                topPadding: 15
                anchors.bottom: parent.bottom
                anchors.horizontalCenter: parent.horizontalCenter

                Text { text: "brightness:" }
                Slider {
                    from: 0.0
                    to: 1.0
                    stepSize: 0.1
                    value: 0.5

                    onValueChanged: {
                        console.log("brightness: " + value)
                        brightnessContrast.brightness = value
                    }
                }

                Text { text: "contrast:" }
                Slider {
                    from: 0.0
                    to: 1.0
                    stepSize: 0.1
                    value: 0.5

                    onValueChanged: {
                        console.log("contrast: " + value)
                        brightnessContrast.contrast = value
                    }
                }
            }
        }

    }
}
